/**
 * 电影卡片
 */

function remove (rank, vm) {
  vm.list = vm.list.filter(item => item.rank !== rank)
}

function MovieItem (h, vm, movie) {
  return h('div.row', {
    key: movie.rank,
    style: {opacity: '0', transform: 'translate(-200px)',
            delayed: {transform: `translateY(${movie.offset}px)`, opacity: '1'},
            remove: {opacity: '0', transform: `translateY(${movie.offset}px) translateX(200px)`}},
    hook: {insert: (vnode) => { movie.elmHeight = vnode.elm.offsetHeight; }},
  }, [
    h('div', {style: {fontWeight: 'bold'}}, movie.rank),
    h('div', movie.title),
    h('div', movie.desc),
    h('div.btn.rm-btn', {on: {click: [remove, movie.rank, vm]}}, 'x'),
  ]);
}

export default MovieItem
